<template>
  <div class="about-master-container">
    <base-breadcrumb :breadcrumb="!isAudit">
      <a-form-model
        ref="RuleForm"
        :model="formData"
        :rules="rules"
      >
        <a-tabs
          type="card"
          class="card-tab"
          @change="getTabChange"
          :activeKey="currentStep"
        >
          <a-tab-pane
            key="1"
            tab="投诉信息"
          >
            <div>
              <a-card
                v-loading="loading || projectLoading"
                :bordered="false"
              >
                <title-name title="基本信息" />
                <a-row>
                  <a-col span="8">
                    <a-form-model-item label="投诉单编号">
                      <BaseInput
                        v-model="formData.code"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <!-- <a-col span="8">
                    <a-form-model-item
                      label="所属分公司"
                      prop="branchComId"
                    >
                      <SelectSubCompany
                        v-if="state == 1"
                        ref="selectSubCompany"
                        v-model="formData.branchComId"
                        :disabled="state != 1"
                        placeholder="请选择"
                      />
                      <BaseInput
                        v-else
                        v-model="formData.branchComName"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col :span="8">
                    <a-form-model-item
                      label="项目名称"
                      prop="projectId"
                    >
                      <SelectProject
                        v-if="state == 1"
                        ref="selectProject"
                        v-model="formData.projectId"
                        placeholder="请选择"
                        :form="formData"
                        :disabled="state != 1"
                        key-value="branchComId"
                        @change="getProId"
                      />
                      <BaseInput
                        v-else
                        v-model="formData.projectName"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col> -->
                  <a-col :span="16">
                    <a-form-model-item
                      label="所属单位"
                      prop="projectId"
                    >
                      <OrgTreeSelect
                        v-model="formData.projectId"
                        :disabled="state != 1"
                        is-auto-select-first
                        @select="setProject"
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col :span="8">
                    <a-form-model-item
                      label="施工阶段"
                      prop="constructionStage"
                    >
                      <a-select
                        v-model="formData.constructionStage"
                        placeholder="请选择"
                        :disabled="state == 3"
                      >
                        <a-select-option
                          v-for="item in sgOptions"
                          :key="item.value"
                          :value="item.value"
                        >
                          {{ item.label }}
                        </a-select-option>
                      </a-select>
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8">
                    <a-form-model-item label="建设单位">
                      <BaseInput
                        v-model="formData.constructionUnit"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8">
                    <a-form-model-item label="业态">
                      <BaseInput
                        v-model="formData.formats"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8">
                    <a-form-model-item label="是否为重点项目">
                      <BaseInput
                        v-model="formData.keyProject"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                </a-row>
              </a-card>
              <a-card
                v-loading="loading"
                :bordered="false"
              >
                <title-name title="投诉信息" />
                <a-row>
                  <a-col span="8">
                    <a-form-model-item label="投诉级别">
                      <a-select
                        v-model="formData.level"
                        placeholder="请选择"
                        disabled
                      >
                        <a-select-option
                          v-for="item in levelData"
                          :key="item.id"
                          :value="item.id"
                        >
                          {{ item.name }}
                        </a-select-option>
                      </a-select>
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8">
                    <a-form-model-item label="投诉时间">
                      <BaseInput
                        v-model="formData.createTime"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col :span="8">
                    <a-form-model-item
                      label="投诉类型"
                      prop="treeId"
                    >
                      <a-tree-select
                        v-model="formData.treeId"
                        :disabled="state == 3"
                        :dropdown-style="{ maxHeight: '500px', overflow: 'auto' }"
                        :replace-fields="{ children: 'children', key: 'id', value: 'id', title: 'name' }"
                        tree-default-expand-all
                        :tree-data="typeData"
                        placeholder="请选择"
                        @change="getTreeId"
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col :span="8">
                    <a-form-model-item
                      label="投诉事项"
                      prop="infoId"
                    >
                      <a-select
                        v-model="formData.infoId"
                        :loading="treeLoading"
                        placeholder="请选择"
                        :disabled="state == 3"
                        @select="getLevel"
                      >
                        <a-select-option
                          v-for="item in treeData"
                          :key="item.id"
                          :value="item.id"
                        >
                          <a-tooltip placement="left">
                            <template slot="title">
                              {{ item.name }}
                            </template>
                            {{ item.name }}
                          </a-tooltip>
                        </a-select-option>
                      </a-select>
                    </a-form-model-item>
                  </a-col>
                  <a-col
                    v-if="state != 1"
                    :span="8"
                  >
                    <a-form-model-item
                      label="投诉责任方"
                      prop="responsible"
                    >
                      <a-radio-group
                        v-model="formData.responsible"
                        :options="responsibleOptions"
                        :disabled="state == 3"
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col
                    v-if="state != 1"
                    :span="8"
                  >
                    <a-form-model-item
                      v-if="formData.responsible != 1 && formData.responsible != null"
                      label="责任分包"
                      :prop="formData.responsible == '1' ? '' : 'subcontractorId'"
                    >
                      <a-select
                        v-model="formData.subcontractorId"
                        placeholder="请选择"
                        :disabled="state == 3 || formData.responsible == '1'"
                        @change="getsubcontracting"
                      >
                        <a-select-option
                          v-for="item in subcontractingData"
                          :key="item.id"
                          :value="item.id"
                        >
                          {{ item.name }}
                        </a-select-option>
                      </a-select>
                    </a-form-model-item>
                  </a-col>
                  <a-col :span="24">
                    <a-form-model-item
                      label="投诉内容"
                      prop="content"
                    >
                      <BaseTextarea
                        v-model="formData.content"
                        :max-length="10000"
                        :disabled="state == 3"
                        placeholder="请输入"
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col :span="8">
                    <a-form-model-item label="投诉人">
                      <a-select
                        v-model="formData.complainant"
                        placeholder="请选择"
                        :disabled="state == 3"
                        @select="getPhone"
                      >
                        <a-select-option
                          v-for="item in ownerData"
                          :key="item.name"
                          :value="item.name"
                        >
                          {{ item.name }}
                        </a-select-option>
                      </a-select>
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8">
                    <a-form-model-item label="联系电话">
                      <BaseInput
                        v-model="formData.phone"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col
                    v-if="state != 1"
                    span="8"
                  >
                    <a-form-model-item label="响应天数">
                      <BaseInput
                        v-model="formData.responseDays"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col
                    v-if="state != 1"
                    span="8"
                  >
                    <a-form-model-item label="处理天数">
                      <BaseInput
                        v-model="formData.handleDays"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col
                    v-if="state != 1"
                    span="8"
                  >
                    <a-form-model-item label="处理次数">
                      <BaseInput
                        v-model="formData.handleTimes"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                </a-row>
              </a-card>
            </div>
            <a-button
              v-if=" formData.handleData && formData.handleData.length>0"
              style="float:right;margin-bottom: 10px;"
              @click="nextStep(2,true)"
              type="primary"
            >下一步</a-button>
          </a-tab-pane>
          <a-tab-pane
            v-for="(ite, i) in formData.handleData"
            :key=" 2 + i"
            :tab="'投诉响应' + '(' + Number(i + 1) + ')'"
          >
            <div>
              <a-card
                v-loading="loading"
                :bordered="false"
              >
                <title-name title="处理信息" />
                <a-row>
                  <a-col span="8">
                    <a-form-model-item label="受理人">
                      <BaseInput
                        v-model="ite.handlerName"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8">
                    <a-form-model-item label="处理时间">
                      <BaseInput
                        v-model="ite.handleTime"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col :span="24">
                    <a-form-model-item
                      label="处理结果"
                      :prop="'handleData.' + i + '.handleResult'"
                      :class="(state == 3 || (state == 2 && (i < formData.handleTimes)))?'':'ruleBaseTextarea'"
                    >
                      <BaseTextarea
                        v-model="ite.handleResult"
                        :max-length="10000"
                        :disabled="state == 3 || (state == 2 && (i < formData.handleTimes))"
                        placeholder="请输入"
                      />
                    </a-form-model-item>
                  </a-col>
                </a-row>
              </a-card>
              <a-card
                v-loading="loading"
                :bordered="false"
              >
                <title-name title="相关附件" />
                <UploadTableNew
                  ref="uploadTable"
                  :mode="mode"
                  :disabled="state == 3 || (state == 2 && i < formData.handleTimes)"
                  :init-file-list="ite.fileList"
                  :need-page="false"
                  :business-code="'CUSTOMER01'"
                  :use-multi-delete="true"
                  :use-multi-export="true"
                />
              </a-card>
            </div>
            <div class="pub-next-btn">
              <a-button
                type="primary"
                @click="previousStep(i)"
              >
                上一步
              </a-button>

              <a-button
                v-if="i< formData.handleData.length -1"
                type="primary"
                @click="nextStep(i)"
              >
                下一步
              </a-button>
            </div>
          </a-tab-pane>

          <a-tab-pane
            v-for="(ite, i) in formData.qualityCheckList"
            :key="'floors-zl' + i"
            :tab="'质量检查单' + '(' + Number(i + 1) + ')'"
          >
            <!-- 质量检查详情 -->
            <QualityInfo
              :query="{ checkType: 0, manageType: ite.problemId ? 1 : 0, id: ite.problemId || ite.id, combine: !!ite.problemId }"
              :showButton="false"
            />
            <!-- <div>
              <a-card
                v-loading="loading"
                :bordered="false"
              >
                <title-name title="项目信息" />
                <a-row>
                  <a-col span="8">
                    <a-form-model-item label="分公司名称">
                      <BaseInput
                        v-model="formData.branchComName"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8">
                    <a-form-model-item label="项目名称">
                      <BaseInput
                        v-model="formData.projectName"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                </a-row>
              </a-card>
              <a-card
                v-loading="loading"
                :bordered="false"
              >
                <title-name title="质量问题信息" />
                <a-row>
                  <a-col span="8">
                    <a-form-model-item label="分项工程">
                      <BaseInput
                        v-model="ite.subProjectName"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8">
                    <a-form-model-item label="检查人">
                      <BaseInput
                        v-model="ite.employee"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8">
                    <a-form-model-item label="检查时间">
                      <BaseInput
                        v-model="ite.checkDate"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8">
                    <a-form-model-item label="检查区域">
                      <BaseInput
                        v-model="ite.checkDescribe"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8" v-if="ite.duty">
                    <a-form-model-item label="责任人">
                      <BaseInput
                        v-model="ite.duty"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col span="24">
                    <a-form-model-item label="现场照片">
                      <l-table
                        v-if="ite.fileList && ite.fileList.length > 0"
                        upload-type="image"
                        :disabled="true"
                        :edit-model="0"
                        :upload-arrys.sync="ite.fileList"
                        multiple
                      />
                      <span v-else>无</span>
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8">
                    <a-form-model-item label="整改人">
                      <BaseInput
                        v-model="ite.rectifier"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8" v-if="ite.rectifierCompany">
                    <a-form-model-item label="整改单位">
                      <BaseInput
                        v-model="ite.rectifierCompany"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8">
                    <a-form-model-item label="复查人">
                      <BaseInput
                        v-model="ite.reCheck"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8">
                    <a-form-model-item label="整改期限">
                      <BaseInput
                        v-model="ite.rectifyTerm"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8">
                    <a-form-model-item label="状态">
                      <BaseInput
                        v-model="ite.status"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8">
                    <a-form-model-item label="问题整改描述">
                      <BaseInput
                        v-model="ite.description"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col span="8">
                    <a-form-model-item label="质量问题描述">
                      <BaseInput
                        v-model="ite.qualityDescription"
                        disabled
                      />
                    </a-form-model-item>
                  </a-col>
                </a-row>
              </a-card>
            </div> -->
          </a-tab-pane>
          <a-tab-pane
            v-for="(ite, i) in formData.safetyCheckList"
            :key="'floors-safe' + i"
            :tab="'安全检查单' + '(' + Number(i + 1) + ')'"
          >
            <!-- 安全检查详情 -->
            <SafeInfo :id="ite.id" />
            <!-- <div>
              <a-card>
                <title-name title="安全检查" />

                <div class="title" :class="ite.safetyAuditStatusEnum">
                  <div class="status">
                    <span v-if="ite.safetyAuditStatusEnumStr === '待整改' && ite.isBeyond == '1'">超期未整改</span>
                    <span v-else>{{ ite.safetyAuditStatusEnumStr }}</span>
                  </div>
                  <div class="type">
                    <span class="name">{{ ite.treeLabelName }}</span>
                    <div class="tag">
                      {{ ite.securityControlEnumStr }}
                    </div>
                  </div>
                </div>

                <BForm :config="formConfig" :form="ite" :rule="saferules" />
              </a-card>
              <a-card>
                <title-name title="整改通知" />
                <BForm :config="form2Config" :form="ite" :rule="saferules" />

                <a-tabs default-active-key="1" style="padding: 0 40px">
                  <a-tab-pane v-if="ite.safetyAuditStatusEnum !== 'QUALIFIED' && ite.safetyAuditStatusEnum !== 'UNQUALIFED'" key="1" tab="流程进度">
                    <a-empty v-if="!ite.safetyCheckData || !ite.safetyCheckData.length" description="暂无流程进度" />
                    <a-steps direction="vertical">
                      <a-step v-for="(safeItem, i) in ite.safetyCheckData" :key="i" :title="safeItem.userName" :sub-title="safeItem.userDes" :description="safeItem.userTime" />
                    </a-steps>
                  </a-tab-pane>
                  <a-tab-pane v-if="ite.safetyAuditStatusEnum === 'REVIEW' || ite.safetyAuditStatusEnum === 'REVIEWPAST' || ite.safetyAuditStatusEnum === 'REVIEWNOPAST'" key="2" tab="整改信息">
                    <div class="list">
                      <a-empty v-if="!ite.rectificationContentVOS || !ite.rectificationContentVOS.length" description="暂无整改信息" />
                      <div v-for="(item, index) in ite.rectificationContentVOS" :key="index" class="item">
                        <div class="l-title">第{{ index + 1 }}次整改</div>
                        <div class="l-row">
                          <div class="left">处理情况：{{ item.rectificationDescribe }}</div>
                          <div class="right">复查意见：{{ item.reviewResult ? (item.reviewResult == '1' ? '通过' : '不通过') : '' }}</div>
                        </div>
                        <div class="l-row">
                          <div class="left">整改人：{{ item.rectificationUserName }}</div>
                          <div class="right">复查人：{{ item.reviewUserName }}</div>
                        </div>
                        <div class="l-row">
                          <div class="left">整改时间：{{ item.rectificationTime }}</div>
                          <div class="right">
                            复查时间：{{ item.reviewTime }}
                            <span style="margin-left: 60px">整改时限：{{ item.rectification }}</span>
                          </div>
                        </div>
                        <div class="l-row">
                          <div class="left">
                            整改照片/视频：
                            <b-upload upload-type="image-list" business-code="UN02" :file-list.sync="item.rectificationImageFileInfoVO" :disabled="true" />
                          </div>
                          <div class="right">
                            复查照片/视频：
                            <b-upload upload-type="image-list" business-code="UN02" :file-list.sync="item.reviewImageFileInfoVO" :disabled="true" />
                          </div>
                        </div>
                      </div>
                    </div>
                  </a-tab-pane>
                  <a-tab-pane key="3" tab="检查照片">
                    <a-empty v-if="!ite.imageFileInfo || !ite.imageFileInfo.length" description="暂无检查照片" />
                    <b-upload upload-type="image-list" business-code="UN02" :file-list.sync="ite.imageFileInfo" :disabled="true" />
                  </a-tab-pane>
                </a-tabs>
              </a-card>
            </div> -->
          </a-tab-pane>
        </a-tabs>
      </a-form-model>

      <div v-if="!isConsultation" class="pub-header-btn page-btn-right-top">
        <a-button
          v-if="state == 2"
          :loading="loading"
          type="primary"
          @click="onSave"
        > 保存 </a-button>
        <a-button
          v-if="state == 1"
          :loading="loading"
          type="primary"
          @click="onAdd"
        > 提交 </a-button>
        <a-button
          v-if="state == 2"
          :loading="loading"
          type="primary"
          @click="submit"
        > 提交 </a-button>
        <a-button
          v-checkVisibleInDetail
          @click="$close"
        > 关闭 </a-button>
      </div>
      <selectApprover
        :businessId="businessId"
        :processConfig="setProcessConfig"
      ></selectApprover>
    </base-breadcrumb>
  </div>
</template>

<script>
import { getLoginsList } from '@/api/project/loginInfo'
import { timeline } from 'ant-design-vue'
import { selectOption } from '@/api/material/goods/goods'
import {
  customerSubmit,
  saveAndSubmit,
  getBusinessCode,
  queryComplaintTree,
  getSubContractorList,
  querySafetyProcessById,
  changeCustomerComplaint,
  addCustomerComplaint,
  getProjectInfo,
  getPCProjectList,
  getOwnerInfoList,
  getComplaintType,
  getComplaintTree,
  getCustomerComplaintById
} from '@/api/complaint'
import { Empty } from 'ant-design-vue'

import UploadList from '@/components/UploadList'
import SelectProject from '@/components/Select/SelectProject' // 项目名称
import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
import QualityInfo from '@/views/quality/components/recordInfo' // 质量信息
import SafeInfo from '@/views/safetySupervision/checkAndRectify/checkRecord/detail' // 安监信息
export default {
  name: 'a' + Date.now(),
  props: {
    // 是否作为审批详情
    isAudit: {
      type: Boolean,
      default: false
    },
    // 是否作为意见征询
    isConsultation: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      handData: {},
      levelData: [
        {
          name: '一般投诉',
          id: '1'
        },
        {
          name: '严重投诉',
          id: '2'
        },
        {
          name: '紧急投诉',
          id: '3'
        }
      ],
      key: '1',
      loading: false,
      state: Number(this.$route.query.state),
      isSubmit: false,
      statuCode: '3',
      row: this.$route.query.row,
      form: { editorName: '', subContractUnitId: '' },
      formData: {
        branchComId: '',
        projectId: '',
        projectName: ''
      },
      safeform: {
        isQualified: 0,
        inspectionRectificationUnqualifiedVOS: {},
        check: {
          rectificationUserName: '无',
          rectificationTime: '无',
          rectificationContent: '无',
          sendUserNames: '无'
        }
      },
      saferules: {},
      rules: {
        constructionStage: { required: true, message: '请选择施工阶段', trigger: 'change' },
        projectId: { required: true, message: '请选择项目名称', trigger: 'change' },
        branchComId: { required: true, message: '请选择所属分公司', trigger: 'change' },
        subcontractorId: { required: true, message: '请选择责任分包', trigger: 'change' },
        responsible: { required: true, message: '请选择投诉责任方', trigger: 'change' },
        treeId: { required: true, message: '请选择投诉类型', trigger: 'change' },
        infoId: { required: true, message: '请选择投诉事项', trigger: 'change' },
        complainant: { required: true, message: '请选择投诉人', trigger: 'change' },
        content: { required: true, message: '请输入投诉内容', trigger: 'blur' },
        handleResult: { required: true, message: '请输入处理结果', trigger: 'blur' }
      },
      mode: this.$route.query.pageTyp === 'add' ? 'add' : 'edit',
      file: {
        mode: this.$route.query.pageTyp === 'add' ? 'add' : 'edit',
        businessCode: 'CUSTOMER01',
        needPage: false,
        fileList: [],
        useMultiDelete: true,
        useMultiExport: true
      },
      projectLoading: false,
      tsUserOptions: [],
      safetyCheckData: [],

      sgOptions: [
        {
          value: '1',
          label: '施工准备阶段'
        },
        {
          value: '2',
          label: '地基基础阶段'
        },
        {
          value: '3',
          label: '主体结构阶段'
        },
        {
          value: '4',
          label: '装饰装修阶段'
        },
        {
          value: '5',
          label: '竣工收尾阶段'
        },
        {
          value: '6',
          label: '维保阶段'
        }
      ],
      responsibleOptions: [
        {
          label: '总包',
          value: '1'
        },
        {
          label: '分包',
          value: '2'
        }
      ],

      typeOptions: [
        {
          value: '1',
          label: '常规投诉'
        },
        {
          value: '2',
          label: '质量投诉'
        },
        {
          value: '3',
          label: '安全投诉'
        }
      ],
      logicalOptions: [
        {
          label: '否',
          value: '0'
        },
        {
          label: '是',
          value: '1'
        }
      ],
      getProgrammeArr: [],
      bimData: [],
      proData: [],
      subcontractingData: [],
      treeLoading: false,
      yhData: [],
      typeData: [],
      projectData: [],
      ownerData: [],
      treeData: [],
      currentStep: '1',
      //获取流程配置值
      processConfig: null,
      //点击提交发送流程配置值
      setProcessConfig: null,
      businessId: null
    }
  },
  components: {
    [timeline.name]: timeline, // "ATimeline"
    [timeline.Item.name]: timeline.Item, // "ATimelineItem"
    AEmpty: Empty,
    SelectSubCompany,
    SelectProject,
    QualityInfo,
    SafeInfo
  },
  computed: {
    formConfig() {
      return [
        {
          row: true,
          children: [
            { type: 'input', value: 'typeName', label: '检查类型', attrs: { disabled: true } },
            { type: 'input', value: 'constructionPhaseName', label: '施工阶段', attrs: { disabled: true } },
            { type: 'input', value: 'treeLabelName', label: '隐患类型', attrs: { disabled: true } },
            { type: 'input', value: 'checkDescribe', label: '具体部位', attrs: { disabled: true } },
            { type: 'input', value: 'dangerProject', label: '是否危大工程', attrs: { disabled: true } },
            { type: 'input', value: 'respAreaName', label: '检查区域', attrs: { disabled: true } },
            { type: 'input', value: 'subcontractorName', label: '分包单位', attrs: { disabled: true } },
            { type: 'input', value: 'creatorName', label: '检查人', attrs: { disabled: true } }
          ]
        }
      ]
    },
    form2Config() {
      return [
        {
          row: true,
          children: [
            //todo下面都没得
            {
              type: 'input',
              value: 'check.rectificationUserName',
              label: '整改人',
              attrs: { disabled: true }
            },
            {
              type: 'input',
              value: 'check.rectificationTime',
              label: '整改时限',
              attrs: { disabled: true }
            },
            {
              type: 'textarea',
              value: 'check.rectificationContent',
              label: '整改要求',
              attrs: { disabled: true },
              colSpan: 24,
              noFixed: true
            },
            {
              type: 'text',
              value: 'check.sendUserNames',
              label: '通知人',
              attrs: { disabled: true },
              colSpan: 24
            }
          ]
        }
      ]
    }
  },
  watch: {
    formData: {
      deep: true,
      handler() {
        this.$checkRequireItem()
      }
    },
    isAudit: {
      // 是否作为审批详情
      immediate: true,
      handler(val) {
        if (val) {
          this.state = 3
        }
      }
    }
  },
  async created() {
    this.initCode()
    //获取通过获取流程配置值
    this.processConfig = await this.$getConfigFn('complaint_normal_01')
  },
  mounted: function () {
    if (this.state != 1) {
      this.getDetail()
      this.isSubmit = true
    }
  },
  methods: {
    /**
     * @description: 设置分公司和项目信息
     * @param {object} val 选中数据
     * @return {void}
     */
    setProject(val) {
      if (val && val.length > 0) {
        this.projectLoading = true
        this.formData.branchComId = val[0]?.orgId
        const value = val[1]?.projectId
        const projectName = val[1]?.projectName
        getProjectInfo(value)
          .then((res) => {
            this.formData = { ...this.formData, ...res.data, projectName }
            this.handData = {
              handlerId: res.data.projectManagerId,
              handlerName: res.data.projectManagerName
            }
            this.projectLoading = false
          })
          .catch((err) => {
            this.projectLoading = false
          })
        getSubContractorList({ projectId: value }).then((node) => {
          this.subcontractingData = node.data
        })
        getOwnerInfoList(value).then((resp) => {
          this.ownerData = resp.data
        })
      }
    },
    nextStep(step, flag) {
      if (step * 1 == 2 && flag) {
        this.currentStep = step
      } else {
        this.currentStep = (3 + step) * 1
      }
    },
    previousStep(step) {
      if (step * 1 == 0) {
        this.currentStep = '1'
      } else {
        this.currentStep = (step + 1) * 1
      }
    },
    getTabChange(step) {
      this.$checkRequireItem()
      this.currentStep = step
      console.log(this.currentStep, 333)
    },
    getsubcontracting(e) {
      const data = this.subcontractingData.find((item) => item.id == e)
      if (data.name) {
        this.formData = { ...this.formData, subcontractorName: data.name }
      }
    },
    getLevel(e) {
      const levelData = this.treeData.find((item) => item.id == e)
      this.formData.level = levelData.type
    },
    getPhone(e) {
      this.formData.phone = this.ownerData.find((item) => item.name == e).phone
      this.formData.complainantId = this.ownerData.find((item) => item.name == e).id
    },
    getDetail() {
      this.loading = true
      getCustomerComplaintById(this.$route.query.id).then(async (res) => {
        if (res.data.handleTime) {
          res.data.handleTime = res.data.handleTime.slice(0, 16)
        }

        if (res.data.handleList.length == 0) {
          res.data.handleData = [
            {
              fileList: [],
              handleTimes: ''
            }
          ]
        } else {
          if (this.state == 2 && res.data.handleList.length === res.data.handleTimes) {
            res.data.handleList.push({
              fileList: [],
              handleTimes: ''
            })
          }
          res.data.handleList.forEach((item) => {
            if (item.handleTime) {
              item.handleTime = item.handleTime.slice(0, 16)
            }
          })
          res.data.handleData = res.data.handleList
        }

        res.data.type = Number(res.data.type)
        res.data.infoId = Number(res.data.infoId)
        if (res.data.status != 0) {
          if (res.data.responseDays == null) {
            res.data.responseDays = 1
          }
          if (res.data.handleDays == null) {
            res.data.handleDays = 1
          }
          if (res.data.handleTimes == null) {
            res.data.handleTimes = 1
          }
        }
        getComplaintTree({ treeId: res.data.treeId }).then((resp) => {
          this.treeData = resp.data
        })
        getOwnerInfoList(res.data.projectId).then((resp) => {
          this.ownerData = resp.data
        })
        getSubContractorList({ projectId: res.data.projectId }).then((node) => {
          this.subcontractingData = node.data
        })
        // 通过项目信息接口更新详情的展示
        getProjectInfo(res.data.projectId).then((resp) => {
          const newData = []
          res.data.handleData.map((item) => {
            newData.push({
              ...item,
              handlerId: resp.data.projectManagerId,
              handlerName: item.handlerName ? item.handlerName : resp.data.projectManagerName
            })
          })
          res.data.handleData = newData
        })

        // 安全检查tab 流程接口
        console.log(res.data.safetyCheckList)
        if (res.data.safetyCheckList?.length) {
          for (let item of res.data.safetyCheckList) {
            item.dangerProject = item.dangerProject == 1 ? '是' : '否'
            item.check = item.inspectionRectificationUnqualifiedVOS ? item.inspectionRectificationUnqualifiedVOS[0] : []
            console.log(item.id)
            const ress = await querySafetyProcessById({ id: item.id })
            if (ress.code === 200) {
              item.safetyCheckData = ress.data
            }
          }
        }

        this.formData = res.data
        this.loading = false
      })
    },
    // getProId(value) {
    //   this.projectLoading = true
    //   const projectName = this.$refs.selectProject.getValueName(value)
    //   getProjectInfo(value)
    //     .then((res) => {
    //       this.formData = { ...this.formData, ...res.data, projectName: projectName }
    //       this.handData = {
    //         handlerId: res.data.projectManagerId,
    //         handlerName: res.data.projectManagerName
    //       }
    //       this.projectLoading = false
    //     })
    //     .catch((err) => {
    //       this.projectLoading = false
    //     })
    //   getSubContractorList({ projectId: value }).then((node) => {
    //     this.subcontractingData = node.data
    //   })
    //   getOwnerInfoList(value).then((resp) => {
    //     this.ownerData = resp.data
    //   })
    // },
    getTreeId(e) {
      let type = ''

      this.typeData.map((item) => {
        item.children.map((ite) => {
          if (ite.id == e) {
            type = ite.type
          }
        })
      })
      this.treeLoading = true
      this.formData = { ...this.formData, level: '', infoId: '', type: type, treeId: e, subcontractorId: '' }
      getComplaintTree({ treeId: e })
        .then((res) => {
          this.treeData = res.data
          this.treeLoading = false
        })
        .catch((err) => {
          this.treeLoading = false
        })
    },
    initCode() {
      this.loading = true
      getPCProjectList({ owner: false }).then((res) => {
        this.projectData = res.data
      })
      queryComplaintTree().then((res) => {
        this.loading = false
        if (res.code === 200) {
          res.data[0].children.forEach((item) => {
            item.disabled = true
          })
          this.typeData = res.data[0].children
        }
      })
    },
    getProgramme: function () {
      let _this = this
      selectOption({
        type: 18
      }).then((res) => {
        if (res.code === 200) {
          _this.getProgrammeArr = res.data
        }
      })
      getLoginsList({}).then((res) => {
        if (res.code === 200) {
          _this.tsUserOptions = res.data
        }
      })
    },
    //  保存并提交
    onAdd() {
      this.$refs.RuleForm.validate((valid) => {
        if (valid) {
          this.loading = true
          this.formData.insertType = 1
          this.formData.handle = this.handData
          this.formData.createTime = null
          this.formData.updateTime = null
          //  this.
          addCustomerComplaint(this.formData)
            .then((res) => {
              if (res.code == 200) {
                this.$message.success('提交成功')
                // this.businessId = res.data?.id
                // this.setProcessConfig = this.processConfig
                this.$router.back()
                this.loading = false
              }
            })
            .catch((err) => {
              this.formData.handle = null
              this.loading = false
            })
        } else {
          this.$message.warning("请填写完所有必填项信息")
        }
      })
    },
    // 编辑新增时候的保存
    onSave() {
      this.loading = true

      if (this.formData.handleData.length != 0) {
        this.formData.handle = this.formData.handleData[this.formData.handleData.length - 1]
        const newHandleData = []
        this.formData.handleData.map((item) => {
          newHandleData.push({
            ...item,
            createTime: null,
            handleTime: null
          })
        })
        this.formData = { ...this.formData, handle: { ...this.formData.handle, createTime: null, handleTime: null }, handleData: newHandleData }
      } else {
        this.formData.handle = null
      }
      this.formData.createTime = null
      this.formData.updateTime = null
      this.formData.handleTime = null
      this.formData.handleList = null
      if (this.state == 1) {
        customerSubmit(this.formData)
          .then((res) => {
            if (res.code == 200) {
              this.loading = false
              this.$message.success('提交成功')
              this.$multiTab.close(this.$route.fullpath)
            }
          })
          .catch((err) => {
            this.loading = false
          })
      } else if (this.state == 2) {
        changeCustomerComplaint(this.formData)
          .then((res) => {
            if (res.code == 200) {
              this.loading = false
              this.$message.success('保存成功')
              this.$multiTab.close(this.$route.fullpath)
            }
          })
          .catch((err) => {
            this.loading = false
          })
      }
    },
    submit() {
      this.$refs.RuleForm.validate((valid) => {
        if (valid) {
          if (this.formData.handleData.length > 0) {
            let handData = this.formData.handleData[this.formData.handleData.length - 1]
            if (!handData.handleResult) {
              this.$message.error('请填写处理结果')
              return
            }
          }
          this.$submitConfirm(async () => {
            this.loading = true
            if (this.formData.handleData.length != 0) {
              const newHandleData = []
              this.formData.handleData.map((item) => {
                newHandleData.push({
                  ...item,
                  createTime: null,
                  handleTime: null
                })
              })

              this.formData.createTime = null
              this.formData.updateTime = null
              this.formData.handle = this.formData.handleData[this.formData.handleData.length - 1]
              this.formData = { ...this.formData, handle: { ...this.formData.handle, createTime: null, handleTime: null }, handleData: newHandleData }
            } else {
              this.formData.handle = null
            }

            this.formData.handleList = null
            this.formData.handleTime = null
            this.formData.insertType = 1
            getBusinessCode({ infoId: this.formData.infoId }).then((resp) => {
              if (this.formData.keyProject == '否') {
                this.formData.businessCode = resp.data.normal_code
              } else {
                this.formData.businessCode = resp.data.key_code
              }
              customerSubmit(this.formData).then((res) => {
                if (res.data.code == 200) {
                  this.loading = false
                  this.$message.success('提交成功')
                  this.businessId = res.data?.id || this.formData.id
                  this.setProcessConfig = this.processConfig
                } else {
                  this.loading = false
                }
              })
            })
          })
        } else {
          this.$message.warning("请填写完所有必填项信息")
        }
      })
    }
  }
}
</script>
<style lang="less" scoped>
.title {
  margin-bottom: 20px;
  padding-left: 80px;

  //合格
  &.QUALIFIED {
    .status {
      color: rgb(75, 121, 2);
    }

    .tag {
      background: rgb(115, 209, 61) !important;
    }
  }

  //待整改
  &.RECTIFICATION {
    .status {
      color: rgb(245, 154, 35);
    }
  }

  //待复查
  &.REVIEW {
    .status {
      color: rgb(236, 86, 98);
    }
  }

  //复查通过
  &.REVIEWPAST {
    .status {
      color: rgb(68, 201, 172);
    }
  }

  //不合格不整改
  &.UNQUALIFED {
    .status {
      color: rgb(236, 128, 141);
    }
  }

  .status {
    font-size: 30px;
    font-weight: bold;
  }

  .type {
    display: flex;
    align-items: center;
    //justify-content: center;
    .name {
      font-size: 20px;
      font-weight: bold;
    }

    .tag {
      margin-left: 6px;
      font-size: 12px;
      background: rgb(250, 205, 145);
      padding: 2px 6px;
      border-radius: 4px;
      color: white;
    }
  }
}

.list {
  color: black;
  font-size: 14px;

  .item {
    margin-bottom: 20px;

    .l-title {
      font-size: 18px;
      font-weight: bold;
    }

    .l-row {
      margin: 10px 0;
      display: flex;

      & > div {
        width: 45%;
        margin-right: 4%;
      }
    }
  }
}

/deep/ .ant-steps-item-wait .ant-steps-item-icon {
  background: #1890ff !important;
  border-color: #1890ff !important;
  color: white !important;
}

/deep/ .ant-steps-item-wait .ant-steps-item-icon > .ant-steps-icon {
  color: white !important;
}

/deep/ .ant-steps-item-wait > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title {
  color: black;
}

/deep/ .ant-steps-item-subtitle {
  color: black !important;
  font-size: 12px;
}

/deep/ .ant-steps-item-description {
  color: black !important;
}
/deep/ .ruleBaseTextarea textarea {
  border-color: #e4ac0b;
  background-color: #fff9e8;
}
</style>
